<style scoped>
.main {
    flex: 1;
    background-color: red;
    display: flex;
    flex-direction: column;
}
</style>
<template>
    <div class="main">
        <template v-for="item in list">
            <Article :id="item.id" :article-id="item.id" :title="item.title" :content="item.content"></Article>
        </template>
    </div>
</template>
<script setup lang="ts">
import Article from './Article.vue';

// 拿到数据   服务器
type Article = {
    id: number,
    title: string,
    content: string
}
const list: Article[] = [
    { id: 1, title: "oracle", content: "世界上最好的数据库" },
    { id: 2, title: "java", content: "世界上最好的编程语言" }
]


</script>